{{header}}
<script type="text/javascript" src="javascript/jquery-1.7.1.js"></script>
<script type="text/javascript">
	$(document).ready(function ()
	{
		$('.languageId').click(function()
		{
			// find the name attribute and post this to the script
			var  $language	=  $(this).attr("name");
			$.ajax({
			    type:		"POST",
				url:		"jquery/doSetNewLanguageAndRedrawPage.php",
			    data:		"language="+$language,
			    cache:		false,
			    dataType:	'json',
			    success:	function(data) 
			    {
					$("#myInfo").html(data.myInfo);
					$("#myCacheInfo").html(data.log);
			    },
			    failure:	function()
			    {
					alert("failure");
			    }

			  });			
		});
	});
</script>

<div align=center style="position:absolute; left:0px; top:20px; width:700px;">#LBL_JQUERY_AJAX#</div>


<div align=center style="position:absolute; left:0px; top:50px; width:700px;"><a href="xajax.php">#LBL_XAJAX#<br><br><a href="classes.zip">Classes.zip for download</a></div>




<!--- language selectors --->
<div align=center style="position:absolute; left:0px; top:120px; width:700px;">
<a data-user="en" class="languageId" name="en" title="#LBL_ENGLISH#" href='#'>			<img src="data/images/en.png" border=0 alt="#LBL_ENGLISH#">#LBL_ENGLISH#</a>
<a data-user="es" class="languageId" name="es" title="#LBL_SPANISH#" href='#'>			<img src="data/images/es.png" border=0 alt="#LBL_SPANISH#">#LBL_SPANISH#</a>
<a data-user="pt" class="languageId" name="pt" title="#LBL_PORTUGUESE#" href='#'>		<img src="data/images/pt.png" border=0 alt="#LBL_PORTUGUESE#">#LBL_PORTUGUESE#</a>


</div>

<!--- this gets manipulated via ajax --->
<div id=myInfo style="position:absolute; top:200px;left:50px;">#LBL_DESCRIPTION#</div>



<!--- this gets manipulated via ajax --->
<div style="position:absolute; top:400px;left:50px;">Logs</div>
<div id=myCacheInfo style="position:absolute; top:420px;left:50px; width:1000px;"></div>


{{footer}}

<script>


</script>